<style type="text/css">
  .nonmultitenant {
    /* width: 130px; */
    white-space:nowrap
  }
  .multitenant {
    /* width: 245px; */
    white-space:nowrap
  }
  .validated {
    /* width: 20px; */
    white-space:nowrap
  }
  .dbusage {
    /* width: 80px; */
    white-space:nowrap
  }
</style>
<div class="col-sm-12 text-right">
  <em class="fas fa-cog fa-spin" ng-show="ctrl.loading==true"></em>
    <a href ng-click="ctrl.loading = false; ctrl.page = 0; ctrl.loadData()" class="btn btn-info" translate lib="web">reload</a>
    <a href ng-click="ctrl.DumpClients()" class="btn btn-info" translate lib="web">Dump</a>
</div>
<div ng-show="ctrl.errormessage != ''"" class=" alert alert-danger" role="alert">{{ctrl.errormessage}}</div>
<table id="table1" class="table table-striped" when-scrolled="ctrl.more()" style="width: 100%;">
  <thead class="thead-dark">
    <tr>
      <th ng-click="ctrl.ToggleOrder('username')"><strong translate lib="web">username</strong></th>
      <th ng-click="ctrl.ToggleOrder('id')"><strong translate lib="web">id</strong></th>
      <th ng-click="ctrl.ToggleOrder('api')"><strong translate lib="web">api</strong></th>
      <th ng-click="ctrl.ToggleOrder('clientagent')"><strong translate lib="web">agent</strong></th>
      <th ng-click="ctrl.ToggleOrder('created')"><strong translate lib="web">created</strong></th>
      <th ng-click="ctrl.ToggleOrder('lastheartbeat')"><strong translate lib="web">heartbeat</strong></th>
      <th ng-click="ctrl.ToggleOrder('remoteip')"><strong translate lib="web">ip</strong></th>
      <th></th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="model in ctrl.models">
      <td class="text-truncate">
        <a style="color: inherit; text-decoration: inherit;" 
        ng-href="#/Entity/{{ctrl.collection}}/{{model._id}}">{{model.username}}</a></td>
      <td class="text-truncate">{{model.id}}</td>
      <td class="text-truncate">{{model.api}}</td>
      <td class="text-truncate">{{model.clientagent}}</td>
      <td>
        <timesince ng-model="model.created" />
      </td>
      <td>
        <timesince ng-model="model.lastheartbeat" />
      </td>
      <td class="text-truncate">
        <a ng-href="https://www.iplocation.net/?query={{model.remoteip}}" target="_blank">{{model.remoteip}}</a>
      </td>
      <td>
        <a ng-href="#/Entity/{{ctrl.collection}}/{{model._id}}" class="btn" ng-show="ctrl.loading == false"
        title="Edit this item"><em
          class="fas fa-edit"></em></a>
        <a href ng-click="ctrl.KillClient(model.id)" class="btn" ng-disabled="ctrl.loading==true"><em
            class="fas fa-trash"></em></a>
      </td>
    </tr>
  </tbody>
</table>


